<template>
  <div class="container">
    <div class="flex flex-row justify-end">
      <div v-if="showCopyBtn" class="copy-btn" @click="handleCopy">
        <img src="@/icons/svg/minute/copy_icon.svg" alt="copy" />
      </div>
    </div>
    <van-empty v-if="isEmpty" description="暂无内容" />
    <markdown v-else :content="report" class="mark-down"></markdown>
  </div>
</template>

<script>
import markdown from "@/components/markdown.vue";
import { useMinutesStore } from "@/store";
import { mapState } from "pinia";
import { showToast } from "vant";
import { addToClipboard } from "/src/utils/stringTool.js";

export default {
  name: "summaryCommon",
  components: { markdown },
  props: {
    report: {
      type: String,
      defaultValue: "",
    },
    showCopyBtn: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {};
  },
  computed: {
    ...mapState(useMinutesStore, {
      conferenceMinutes: "conferenceMinutes",
    }),
    isEmpty() {
      return this.report?.length === 0 || this.report === null;
    },

    salesSummaryReports() {
      return this.report?.salesSummaryReports || [];
    },
  },
  methods: {
    handleCopy() {
      const plainText = this.report.replace(/[#*`]/g, "").replace(/\n{2,}/g, "\n");
      addToClipboard(plainText);
      showToast("复制成功");
    },
  },
};
</script>

<style lang="less" scoped>
.container {
  padding: 12px 24px;
}

.copy-btn {
  width: 32px;
  height: 32px;
  // right: 4px;
  // top: -10px;
  // position: absolute;
  font-size: 18px;
  color: #606266;
  background-color: white;
  border-radius: 4px;
  padding: 6px;
  cursor: pointer;
  margin-bottom: 6px;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);

  img {
    width: 20px;
    height: 20px;
  }
}

.mark-down {
  background: #f9fafc;
  border-radius: 8px;
  padding: 15px;
}

:deep h1 {
  font-weight: 600;
  font-size: 16px;
  color: #333333;
  line-height: 24px;
}

:deep h2 {
  font-weight: 600;
  font-size: 16px;
  color: #333333;
  line-height: 24px;
}

:deep h3 {
  font-weight: 600;
  font-size: 15px;
  color: #333333;
  line-height: 24px;
}
</style>
